<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="../../../layuiadmin/layui/css/layui.css" media="all">
		<link rel="stylesheet" href="../../../layuiadmin/style/admin.css" media="all">
		<link rel="stylesheet" href="../../../css/common.css" media="all">
	</head>

	<body>
		<div class="layui-form-item">
			<div class="layui-form-label">导入操作</div>
			<div class="layui-form-block">
				<input type="file" class="layui-btn layui-btn-primary" id="LAY-excel-import-excel" multiple="multiple" accept="application/msexcel">
				<button data-method="confirmTrans" class="layui-btn">导入表格</button>
			</div>

			<table class="layui-hide" id="demo" lay-filter="test"></table>

		</div>
		<script type="text/javascript" src="../../../js/jquery.min.js"></script>
		<script type="text/javascript" src="../../../layuiadmin/excel/xlsx.core.min.js"></script>
		<script src="../../../layuiadmin/layui/layui.js"></script>
		<script src="../../../js/jquery.min.js"></script>
		<script src="../../../js/jquery.jqprint-0.3.js"></script>
		<script src="../../../js/common.js"></script>
		<script>
			layui.config({
				base: '../../../layuiadmin/' //静态资源所在路径
			}).extend({
				index: 'lib/index' //主入口模块
			}).use(['index', 'form', 'laytpl', 'laydate', 'table'], function() {
				var $ = layui.$,
					admin = layui.admin,
					laytpl = layui.laytpl,
					laydate = layui.laydate,
					table = layui.table,
					form = layui.form;
				var _data = {}
				var _newData = []

				function initdata() {
					for(var i = 0; i < _data.length; i++) {
						console.log(_data[i])
						var order = new Object();
						for(x in _data[i]) {
							switch(x) {
								case '会员编号':
									order.memberid = _data[i][x];
									break;
								case '用户编号':
									order.userid = _data[i][x];
									break;
								case '订单明细':
									var sub = _data[i][x];
									var subs[] = sub.split(',')
									for(var j = 0; j < subs.length; j++) {
										subs[j].split('')
									}
									break;
								case '订单类型':
									order.type = _data[i][x];
									break;
								case '订单编号':
									order.orderid = _data[i][x];
									break;
								case '共计($)':
									order.pay_price = _data[i][x];
									break;
								case '支付状态':
									order.status_pay = _data[i][x];
									break;
								case '红包抵扣金额':
									order.fee_packet = _data[i][x];
									break;
								case '收件人':
									order.consignee = _data[i][x];
									break;
								case '手机':
									order.mobile = _data[i][x];
									break;
								case '地区':
									order.areaname = _data[i][x];
									break;
								case '详细地址':
									order.address = _data[i][x];
									break;
								case '社区编号':
									order.teamid = _data[i][x];
									break;
								default:
									break;
							}

						}
						_newData.push(order)
					}
					console.log(_newData)
					console.log(_newData.length)
					//执行一个 table 实例
					table.render({
						elem: '#demo',
						height: 420,
						data: _newData,
						title: '数据导入预览',
						page: true //开启分页
							,
						toolbar: 'default' //开启工具栏，此处显示默认图标，可以自定义模板，详见文档
							,
						totalRow: true //开启合计行
							,
						cols: [
							[ //表头
								{
									width: 100,
									type: 'memberid',
									title: '会员编号',
								}, {
									field: 'userid',
									title: 'ID',
									width: 100,
									sort: true,
									fixed: 'left',
									totalRowText: '合计：'
								}, {
									field: 'type',
									title: '订单类型',
									width: 90,
									sort: true,
									totalRow: true
								}, {
									field: 'orderid',
									title: '订单编号',
									width: 80,
									sort: true
								}, {
									field: 'pay_price',
									title: '付款金额',
									width: 80,
									sort: true,
									totalRow: true
								}, {
									field: 'fee_packet',
									title: '红包抵扣',
									width: 150
								}

							]
						]
					});
				}
				$('#LAY-excel-import-excel').change(function(e) {
					var files = e.target.files;
					var fileReader = new FileReader();
					fileReader.onload = function(ev) {
						try {
							var data = ev.target.result
							var workbook = XLSX.read(data, {
								type: 'binary'
							}); // 以二进制流方式读取得到整份excel表格对象
							persons = [];
						} catch(e) {
							alertMsg(2, '文件类型不正确, 请重新选择文件');
							return;
						}
						// 表格的表格范围，可用于判断表头是否数量是否正确
						var fromTo = '';
						// 遍历每张表读取
						for(var sheet in workbook.Sheets) {
							if(workbook.Sheets.hasOwnProperty(sheet)) {
								fromTo = workbook.Sheets[sheet]['!ref'];
								if(!fromTo) {
									alertMsg(2, '文件内容为空, 导入失败');
									return;
								}
								persons = XLSX.utils.sheet_to_json(workbook.Sheets[sheet]);
								// break; // 如果只取第一张表，就取消注释这行
							}
						}
						_data = persons;
						initdata()
						console.log(persons);
						//将persons赋值给要展示的表格数组里即可展示在界面

					};
					// 以二进制方式打开文件
					if(files.length == 0) {
						return;
					}
					fileReader.readAsBinaryString(files[0]);
					e.target.value = '';
				});
				var active = {
					confirmTrans: function() {
						//配置一个透明的询问框
						layer.msg('确定导入这些数据吗？', {
							time: 20000, //20s后自动关闭
							btn: ['Yes', 'No'],
							yes: function() {
								layer.msg('ok')
							},
							btn2: function() {
								layer.msg('no')
							}
						});
					}
				};

				$('.layui-btn').on('click', function() {
					var othis = $(this),
						method = othis.data('method');
					active[method] ? active[method].call(this, othis) : '';
				});

			});
		</script>
	</body>

</html>